import React, { useEffect, useMemo, useState } from 'react'
import Taro, { usePullDownRefresh } from '@tarojs/taro'
import {View,Image,Text} from '@tarojs/components'
import './index.scss'

export default function ReturnApply() {
  const [info,setInfo] = useState({})
  const [reasonList, setreasonList] = useState([])
  const [curSelect,setCurSelect] = useState(null)
  useEffect(()=>{
    _initData()
  },[])
  const _initData =e=>{
    Taro.showLoading({title:'加载中...'})
    Taro.$get('/cinema-app/api/v1/order',{orderId:Taro.getCurrentInstance().router.params.id},'1').then(res=>{
      if(res.code == '1'){
        setInfo(res.content)
      }else{
        Taro.$toast(res.message)
      }
    })
    Taro.$get('/merchant/sysDicts/refundReason').then(res=>{
      if(res.code == '1'){
        setreasonList(res.content)
      }
    })
  }
  return (
    <View className='return-apply'>
      <View className="apply-title">退款金额</View>
      <View className="apply-card">
        <View className="card-item">
          <View className="item-price">{info.payAmount} 元</View>
        </View>
        <View className="card-item">
          <View className="item-label">预计3个工作日内原路退回</View>
        </View>
      </View>
      <View className="apply-title">退款原因(至少选一项)</View>
      <View className="apply-card">
        {reasonList?.map(res=>{
          return <View className="card-item" key={res.code} onClick={()=>{
            setCurSelect(res.value)
          }}>
          <View className="item-label">{res.value}</View>
          <Image src={require(`@/images/common/${res.value == curSelect?'yuan':'unselected'}.png`)} className='img' mode='aspectFill' />
        </View>
        })}
      </View>
      <View className="apply-footer">
        <View className={`button`} onClick={()=>{
          if(info.leftRefundCount<1) return;
          Taro.showModal({
            title:'退款申请',
            content:"是否提交申请?",
            success:res=>{
              if(res.confirm){
                Taro.showLoading({title:"加载中..."})
                Taro.$post('/cinema-app/api/v1/order/refund',{
                  "orderId":Taro.getCurrentInstance().router.params.id,
                  refundReason:curSelect
                },'1').then(ret=>{
                  if(ret.code == '1'){
                    Taro.$toast('提交成功','success')
                    setTimeout(() => {
                      Taro.navigateBack()
                    }, 1000);
                  }else{
                    Taro.$toast(ret.message)
                  }
                })
              }
            }
          })
        }}>提交退款申请</View>
      </View>
    </View>
  )
}
